<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>购票</title>
    <link type="text/css" rel="stylesheet" href="../../static/css/style.css"/>
    <script src="/static/script/jquery-1.7.2.js"></script>
    <script>
        $(function (){
            var s = "全部"
            var showingFilms = "正在热映"
            $("#film_a").attr("href","/showFilms?filmState="+showingFilms+"&filmType="+s+"&zone="+s)

            var dates = document.getElementsByClassName("date_a")
            for (var i = 0; i < dates.length; i++) {
                //获取日期
                var date = dates[i].id
                dates[i].setAttribute("href","/toBuyTicket?filmName={{.NowFilm.FilmName}}&date="+date)

                if (date === "{{.Date}}") {
                    dates[i].setAttribute("style","color:white")
                    //获取父元素
                   var div_date = dates[i].parentNode
                   div_date.setAttribute("style","background-color:darkcyan;width: 120px;height: 25px;padding-top: 8px;text-align: center;border-radius: 15px;")
                }
            }

            var buy = document.getElementsByClassName("buy_but")
            for(var i=0;i<buy.length;i++) {
                buy[i].onmouseover = function () {
                    this.setAttribute("style","background-color: cadetblue;width: 100px;height: 30px;border: 2px solid lightgray;border-radius: 15px;color: white");
                };
                buy[i].onmouseout = function () {
                    this.setAttribute("style","background-color: #b8dee7;width: 100px;height: 30px;border: 2px solid lightgray;border-radius: 15px;")
                };
                buy[i].onclick = function (){
                    //获取演出计划id
                  var shceduleID = this.id
                  location = "/seatPage?scheduleID="+shceduleID;
                };
            }
        });
    </script>
</head>
<body>
<!--首行-->
<div id="header">
    <table>
        <tr>
            <td>
                <span><img src="/static/img/logo.png" style="float: left;border-radius: 52px"></span>
                <span id="index_logo"><a href="/" style="color:red;margin-top: 10px;float: left;vertical-align: middle;">猫眼电影</a></span>
            </td>

            <td><a href="/main">首页</a></td>
            <td><a id="film_a">电影</a></td>
            <td style="background-color: cadetblue"><a href="/">影院</a></td>
            <td><a href="/filmList">榜单</a></td>
            <td>
                <form action="/selectFilm" method="post">
                    <input class="search" type="search" placeholder="找影视剧" autocomplete="off" name="filmName"><input class="submit" type="submit" value="搜索">
                </form>
            </td>
            <td><a href="/login">
                {{if .IsLogin}}
                <img src="{{.User.ImgPath}}" style="width: 50px;border-radius: 50px;border: 2px solid darkblue">
                {{else}}
                <img src="/static/img/0.png" style="width: 50px;border-radius: 50px;border: 2px solid darkblue">
                {{end}}
            </a>
            </td>
        </tr>
    </table>
</div>

<!--第一部分-->
<div id="body_head">
    <table id="body_table">
        <tr>
            <td rowspan="2">
                <img src="{{.NowFilm.ImgPath}}">
            </td>
            <td style="font-family: '宋体'">
                <div style="font-size: 30px;">{{.NowFilm.FilmName}}</div><br/>
                <div>{{.NowFilm.FilmType}}</div>
                <div>{{.NowFilm.Zone}}/{{.NowFilm.Duration}}分钟</div>
                <div>{{.NowFilm.ScreenDate}} {{.NowFilm.Zone}}上映</div>
            </td>
        </tr>
        <tr>
            <td></td>
            <td rowspan="2">
                <p style="font-size: 14px">累计票房</p>
                <div style="font-size: 20px">{{.NowFilm.TicketOffice}} <span style="font-size: 14px">元</span></div>
            </td>
        </tr>
    </table>
</div>

<!--第二部分-->
<div id="body_second">
    <hr style="color: #e3e3e3;width: 90%"/>
    <table style="margin-left: 50px">
        <tr>
            <td style="color: gray">观影时间</td>
            {{range .Dates}}
            <td><div id="date_choice"><a class="date_a" id="{{.}}" style="color: black">{{.}}</a></div></td>
            {{end}}
        </tr>
    </table>

    <table id="buy_table">
        <tr style="height: 60px;font-family: '宋体'">
            <th>放映时间</th>
            <th>放映厅</th>
            <th>售价（元）</th>
            <th>选座购票</th>
        </tr>

        {{range .Schedules}}
        <tr style="border-bottom: 1px #e3e3e3 solid;">
            <td style="text-align: center;">{{.StartTime}}<div style="font-size: 12px;color: gray">{{.EndTime}}散场</div></td>
            <td style="text-align: center;">{{.HallID}}</td>
            <td style="text-align: center;">{{.Price}}</td>
            <td style="text-align: center;"><input type="button" class="buy_but" id="{{.ID}}" value="选座购票" style="background-color: #b8dee7;width: 100px;height: 30px;border: 2px solid lightgray;border-radius: 15px;"></td>
        </tr>
        {{else}}
        <tr>
            <td style="text-align: center" colspan="4">┭┮﹏┭┮ ，没有演出啦，改天再来吧~</td>
        </tr>
        {{end}}
    </table>
</div>


<!--尾行-->
<div class="bottom">

    商务合作邮箱：v@maoyan.com 客服电话：10105335 违法和不良信息/涉未成年人有害信息举报电话：4006018900<br>

    用户举报/涉未成年人有害信息举报邮箱：tousujubao@meituan.com 舞弊线索举报邮箱：wubijubao@maoyan.com<br>

    中华人民共和国增值电信业务经营许可证 京B2-20190350 | 营业性演出许可证 京演（机构）（2019）4094号<br>

    广播电视节目制作经营许可证 （京）字第08478号 | 网络文化经营许可证 京网文（2022）1334-041号<br>

    艺术品经营单位备案证明 京东艺（2022）0095号<br>

    猫眼用户服务协议 | 猫眼平台交易规则总则 | 隐私政策<br>

    京公网安备 11010102003232号 | 京ICP备16022489号-1<br>

    北京猫眼文化传媒有限公司<br>

    ©2023 猫眼电影 www.maoyan.com<br>
</div>
</body>
</html>